<template>
	<view class="satisfactionLogContainer">
		<!-- <view :class="satisfactionLog.satisfactionResult+' satisfactionIcon'"></view> -->
		<u-cell-group>
			<u-cell title="整体评价" :value="satisfactionLog.satisfactionResultLabel"></u-cell>
			<u-cell title="数据来源" :value="satisfactionLog.isDefaultValue?'系统默认':'咨询人评价'"></u-cell>
			<template
				v-if="satisfactionResultMap[satisfactionLog.satisfactionResult] && satisfactionResultMap[satisfactionLog.satisfactionResult].showSub">
				<template v-for="item in satisfactionLog.items">
					<u-cell :title="subOptsMap[item.evaluationDimension]" :value="item.satisfactionResultLabel"></u-cell>
				</template>
				<u-cell title="问题" :label="satisfactionLog.remark"></u-cell>
			</template>
		</u-cell-group>
	</view>
</template>

<script>
	export default {
		props: {
			satisfactionLog: {}
		},
		data() {
			return {
				satisfactionOptions: [],
				satisfactionResultMap: {},
				subOptsMap: {
					// service: '服务态度',
					// efficiency: '效率',
					// environment: '环境',
					// ability: '能力',
					// honest: '廉洁',
					// other: '其它'
				},
				subOpts: [],
			}
		},
		methods: {
			loadSatisfactionResults: async function() {
				console.log('loadSatisfactionResults')
				this.satisfactionOptions = await this.$commonData.getSatisfactionResultOptions()
				this.satisfactionOptions.forEach(item => {
					this.$set(this.satisfactionResultMap, item.value, item)
				})
			},
			evaluationDimensionOptions: async function() {
				console.log('evaluationDimensionOptions')
				this.subOpts = await this.$commonData.getEvaluationDimensionOptions()
				this.subOpts.forEach(item => {
					this.$set(this.subOptsMap, item.value, item.label)
				})
			},
		},
		beforeMount() {
			console.log('onLoad satisfactionInfo。。。')
			this.loadSatisfactionResults()
			this.evaluationDimensionOptions()
		}
	}
</script>
<style lang="scss" scoped>
	.satisfactionLogContainer {
		position: relative;
		background: $uni-bg-color;

	
		.satisfied {
			background-image: url('@/static/images/im/satisfied.png');
		}

		.basically_satisfied {
			background-image: url('@/static/images/im/generally.png');
		}

		.dissatisfied {
			background-image: url('@/static/images/im/dissatisfied.png');
		}

		.satisfactionIcon {
			width: 5rem;
			height: 5rem;
			display: block;
			background-position: center;
			background-repeat: no-repeat;
			background-size: 100% 100%;
			position: absolute;
			right: 0;
			z-index: 999;
			top: 0;
		}
	}
</style>